<template>
  <!-- 这是右侧组件 -->
  <div>
    <div>
      <div class="font">名称</div>
      <el-input :disabled="DisableClone" class="btn" v-model="name" placeholder="请输入内容"></el-input>
    </div>
    <div>
      <div class="font">编码</div>
      <el-input :disabled="DisableClone" class="btn" v-model="code" placeholder="请输入内容"></el-input>
    </div>
    <div>
      <div class="font">描述</div>
      <el-input :disabled="DisableClone" class="btn" v-model="description" placeholder="请输入内容"></el-input>
    </div>
    <div>
      <div style="margin-top: 20px">
        <el-radio-group v-model="groupId" size="small">
          <el-radio-button :disabled="DisableClone" :label="i.code" v-for="i in ZH" :key="i.code">{{i.name}}</el-radio-button>
        </el-radio-group>
      </div>
    </div>
    <div>
      <el-button :disabled="DisableClone" type="primary" v-if="BTNSIGN=='add'" @click="ADDFun">添加</el-button>
      <el-button :disabled="DisableClone" type="primary" v-if="BTNSIGN=='compile'" @click="COMPILEFun">编辑</el-button>
      <el-button :disabled="DisableClone" v-if="BTNSIGN=='add'||BTNSIGN=='compile'" @click="CANCELFun">取消</el-button>
    </div>
    
  </div>
</template>
<script>
// import Bus from "./BUS";
export default {
  props: ["Disable", "RFData", "ZH"],
  data() {
    return {
      //右侧
      name: undefined, //名称
      code: undefined, //编码
      description: undefined, //描述
      parentId: undefined,
      id: undefined,
      groupType: undefined,
      groupId:undefined,
      DisableClone: true, //右侧禁用开关
      BTNSIGN: "", //按钮显示‘更新’还是‘创建’
      //添加目标
      addTarget: {}
    };
  },
  mounted() {
    this.$bus.on("treeclicknode", nodeKey => {
      console.log("点击左侧树形图传到右侧输入框的值！");
      console.log(nodeKey);
      this.DisableClone = true;
      let B = JSON.parse(JSON.stringify(nodeKey));
      this.name = B.name;
      this.code = B.code;
      this.description = B.description;
      this.parentId = B.parentId;
      this.id = B.id;
      this.groupType = B.groupType;
      this.$emit('clicktreefun',nodeKey)
    });
    /*
    这是添加、编辑、删除按钮相应回来的
      Sign="add"      添加
      Sign="compile"  编辑
      Sign="delete"   删除
       */
    this.$bus.on("gotoRightFrom", Sign => {
      console.log(Sign);
      if (Sign == "add") {
        //上标记
        this.BTNSIGN = "add";
        //1.禁用项为false
        this.DisableClone = false;
        //2.清空输入框
        [this.name, this.code, this.description] = ["", "", ""];
        //3.拿到输入的值
      } else if (Sign == "compile") {
        if (this.id == undefined) {
          alert("选择一项！");
        } else {
          //上标记
          this.BTNSIGN = "compile";
          //1.禁用项为false
          this.DisableClone = false;
          //2.拿到输入的值
        }
      } else if (Sign == "delete") {
        this.BTNSIGN = "delete";
        let obj = {
          id: this.id,
          name: this.name,
          code: this.code,
          description: this.description,
          parentId: -1, //加在最外层
          groupType: 2 //第一组
        };
        this.$emit("deletelist", obj);
      }
    });
  },
  watch: {
    RFData() {
      console.log("监听RFData");
      this.DisableClone = JSON.parse(JSON.stringify(this.Disable));
      let B = JSON.parse(JSON.stringify(this.RFData));
      this.name = B.name;
      this.code = B.code;
      this.description = B.description;
      this.parentId = B.parentId;
      this.id = B.id;
      this.groupType = B.groupType;
    }
  },
  methods: {
    //点击添加
    ADDFun() {
      //  console.log("添加！");
      let obj = {
        name: this.name,
        code: this.code,
        description: this.description,
        parentId: -1, //加在最外层
        groupType: 2 //第一组
      };
      this.$emit("foraddfunction", obj);
      console.log('this.$emit("foraddfunction",obj)');
    },
    //点击编辑
    COMPILEFun() {
      // alert("编辑！");
      let obj = {
        name: this.name,
        code: this.code,
        description: this.description,
        groupId:this.groupId,
        parentId: -1, //加在最外层
        groupType: 2 //第一组
      };
      this.$emit("docompile", obj);
    },
    //点击取消
    CANCELFun() {
      // alert("取消！");
      this.DisableClone = true;
      this.BTNSIGN = "cancel";
    }
  }
};
</script>